<template>
	<view class="tabbars" :style='{background: backgroundcolor}'>
		<uni-icons v-if="showicon" class="left-icon" color="#ffffff" type="back" @click="back()"></uni-icons>
		<view class="tabbar-title">
			{{title}}
		</view>
	</view>
</template>

<script>
	export default {
		name: 'socialized-tabbar',
		props: {
			title: {
				type: String,
				required: true
			},
			//是否展示返回图标
			showicon: {
				type: Boolean
			},
			backgroundcolor: {
				type: String
			},
			detal: {
				type: Number
			}
		},
		data() {
			return {}
		},
		mounted() {
			
		},
		methods: {
			back() {
				if(this.detal == 1) {
					uni.redirectTo({
						url: '/subPage1/socialized-service/specialist-consultation/user-module/my-consultation/my-consultation'
					})
					return
				} else if(this.detal == 2) {
					uni.redirectTo({
						url: '/subPage1/socialized-service/specialist-consultation/expert-module/my-diagnosis/my-diagnosis'
					})
					return
				} else if(this.detal == 3) {
					uni.redirectTo({
						url: '/subPage1/socialized-service/specialist-consultation/user-module/my-consultation/my-consultation'
					})
					return
				} else if (this.detal == 4) {
					uni.redirectTo({
						url: '/subPage1/socialized-service/specialist-consultation/user-module/my-consultation/my-consultation'
					})
					return
				} else if (this.detal == 5) {
					uni.redirectTo({
						url: '/subPage1/socialized-service/specialist-consultation/expert-module/diagnostic-list/diagnostic-list'
					})
					return
				} else if (this.detal == 6) {
					uni.redirectTo({
						url: '/subPage1/socialized-service/specialist-consultation/expert-module/person-message/person-message'
					})
					return
				} else if (this.detal == 7) {
					uni.redirectTo({
						url: '/subPage1/socialized-service/specialist-consultation/expert-module/person-message/person-message'
					})
					return
				}
				uni.redirectTo({
					url: '/subPage1/socialized-service/specialist-consultation/user-module/consultation-list/consultation-list'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.tabbars {
		z-index: 10000;
		width: 100%;
		// height: 136rpx;
		// line-height: 88rpx;
		padding-top: 90rpx;
		padding-bottom: 14rpx;
		background: linear-gradient(315deg, #0480FB 0%, #57DED9 100%);
		// box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0,0,0,0.16);
		position: fixed;
		display: flex;
		justify-content: space-around;
		align-items: flex-end;
		top: 0rpx;

		.left-icon {
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			left: 36rpx;
		}

		.tabbar-title {
			// height: 88rpx;
			font-size: 32rpx;
			font-family: Source Han Sans CN-Medium, Source Han Sans CN;
			font-weight: 500;
			color: #FFFFFF;
		}
	}
</style>